import {View, Text, Button} from 'react-native';
import React from 'react';
import {createNativeStackNavigator} from '@react-navigation/native-stack';

// 栈路由 类似于网页的history路由
const Stack = createNativeStackNavigator();

function Home({navigation}) {
  return (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
      <Text>Home</Text>
      <Button
        title="跳转到新闻页面"
        onPress={() => navigation.navigate('newScreen')}
      />
    </View>
  );
}

function newScreen({navigation}) {
  return (
    <View style={{flex: 1, alignItems: 'center', justifyContent: 'center'}}>
      <Text>newScreen</Text>
      <Button title="跳转到Home " onPress={() => navigation.navigate('Home')} />
    </View>
  );
}
export default function StackNavigationCom() {
  return (
    <Stack.Navigator initialRouteName="Home">
      <Stack.Screen name="Home" component={Home} />
      <Stack.Screen name="newScreen" component={newScreen} />
    </Stack.Navigator>
  );
}
